<!--测试vue的时间绑定-->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script type="text/javascript" src="../js/vue.js"></script>
</head>
<body>
    <div id = 'app'>
        <button v-on:click = "showInfo">点击事件(不传递参数)</button><br/>

        <button @click = "showInfo">点击事件(v-on简写方式)</button>
        <button v-on:click = "showInfo2(66,$event)">点击事件(传递参数,并且传递event事件)</button>
    </div>
    <script type="text/javascript">
        Vue.config.productionTip = false
        function showInfo3(){
            alert("showInfo3被调用")
        }
        const vm = new Vue({
            el: '#app',
            data:function(){
                return {
                    name:'zhangsan'
                }
            },
            methods:{
                showInfo(event){
                    console.log(event)
                    console.log(event.target)
                    console.log(event.target.innerText)
                    console.log(this == vm)  //此处的this就是vm，如果在对象中使用箭头函数，此时的this就是window对象
                },
                showInfo2(number){
                    console.log(number)
                    console.log(event.target.innerText)
                }

            }  
        })

    </script>
     
</body>

</html>